<!-- 搜索页面 -->
<template>
  <div>
    <app-header></app-header>
    <div class="m-sech-wrap displayflex">
      <div class="flex1">
        <div class="m-sech-box displayflex">
          <i class="iconfont icon-search"></i>
          <div class="flex1 m-sech-ipt">
            <input type="text" :placeholder="placeholderName" v-model="searchTxt" id="sechIpt">
          </div>
          <i class="iconfont icon-del-black" v-if="searchTxt" @click="searchTxt = ''"></i>
        </div>
      </div>
      <div class="m-sech-btn" @click="backSech(searchTxt)">确定</div>
    </div>

    <div class="noDate_page" v-if="todolist.length == 0">
      <div class="noDate_icon"><i class="iconfont icon-null"></i></div>
      暂无数据！
    </div>

    <div class="sech-list-wrap" v-if="todolist.length > 0 && searchTxt">
      <ul class="sech-list" v-for="items in todolist">
        <li @click="backSech(items)">{{items}}</li>
      </ul>
    </div>
  </div>
</template>

<script>
import appHeader from '@/components/core/header/app_header.vue';
export default {
  components: {
    appHeader
  },
  name:'seach',
  data () {
    return {
      placeholderName:'',
      searchTxt:'',
      query:{},
      methodName:'',
      todolist:'',
      classfiy:'',
    }
  },
  watch:{
    searchTxt(val){
      if(val){
        this.getData();
      }else{
        sessionStorage.sechtxt = '';
      }
    },
  },
  created(){
    this.searchTxt = sessionStorage.sechtxt;
    if(this.$route.query.GoodsCate){
      this.classfiy = this.$route.query.GoodsCate;
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.resetDate();
      $("#sechIpt").focus();
    })
  },
  methods:{
    classfiyf(){
      sessionStorage.classfiy = this.classfiy;
      this.$router.go(-1);
    },
    resetDate(){
      var userinfo = JSON.parse(localStorage.userinfo);
      this.placeholderName = "输入商品名称";
      this.query={
        StaffGuid: userinfo.StaffID,
        GoodsCate: this.classfiy,
        GoodsName: this.searchTxt,
        PageIndex: 1,
        PageSize: 99999,
      }
      this.methodName = 'Getmfgoods';
    },
    getData(){
      this.resetDate();
      var self = this;
      this.Ajax.post(self.methodName, self.query).then(function(resp) {
        var datas = resp.Datas,
            temp = new Array(),
            result = [];
        for(var i in datas){
            if(temp.indexOf(datas[i].GoodsName) == -1){
              temp.push(datas[i].GoodsName)
            }
        }
        result = temp;
        self.todolist = result;
      });
    },
    backSech(val){
      if(val){
        sessionStorage.sechTxt = val;
      }else{
        sessionStorage.sechTxt = '';
      }
      this.$router.go(-1);
    }
  },
}
</script>
